<html>
    <head>
        <title>Witness Listing and Voting</title>
        <script src="bundle.js"></script>
    </head>
    <body>
        <div class="container" id="content">
            <form>
                <h4>Create a list of active witnesses</h4>
                <div class="form-group row">
                    <label for="limit" class="col-sm-4 col-form-label">
                        Max length of list to display (max 100)
                    </label>
                    <div class="col-sm-8">
                        <input
                            type="number"
                            class="form-control"
                            id="limit"
                            min="50"
                            max="100"
                            value="50"
                        />
                    </div>
                </div>
                <div class="form-group row">
                    <label for="staticEmail" class="col-sm-4 col-form-label">
                        Generate a witness list
                    </label>
                    <div class="col-sm-8">
                        <input
                            id="createListBtn"
                            type="button"
                            value="Fetch current Witnesses"
                            onclick="createList()"
                            class="btn btn-primary"
                        />
                    </div>
                </div>
            </form>
            <h4>Vote for a witness</h4>
            <form>
                <div class="form-group row">
                    <label for="username" class="col-sm-4 col-form-label">
                        Username
                    </label>
                    <div class="col-sm-8">
                        <input
                            id="username"
                            type="text"
                            class="form-control"
                            value=""
                        />
                    </div>
                </div>
                <div class="form-group row">
                    <label for="postingKey" class="col-sm-4 col-form-label">
                        Active private key
                    </label>
                    <div class="col-sm-8">
                        <input
                            type="password"
                            class="form-control"
                            id="activeKey"
                            value=""
                        />
                    </div>
                </div>
                <div class="form-group row">
                    <label for="witness" class="col-sm-4 col-form-label">
                        Witness
                    </label>
                    <div class="col-sm-8">
                        <input
                            type="text"
                            class="form-control"
                            id="witness"
                            value="initminer"
                        />
                    </div>
                </div>
                <div class="form-group row">
                    <div class="offset-sm-4 col-sm-8">
                        <input
                            id="submitVoteBtn"
                            type="button"
                            value="Check vote status"
                            onclick="submitVote()"
                            class="btn btn-primary"
                        />
                    </div>
                </div>
                <div
                    class="form-group row"
                    id="voteCheckContainer"
                    style="display: none;"
                >
                    <label for="voteCheck" class="col-sm-4 col-form-label">
                        Vote check
                    </label>
                    <div class="col-sm-8">
                        <div id="voteCheck" class="form-control-plaintext"></div>
                    </div>
                </div>
                    <div class="offset-sm-4 col-sm-8">
                        <input
                            id="submitYesBtn"
                            type="button"
                            value="YES"
                            onclick="submitYes()"
                            class="btn btn-primary"
                            style="visibility: hidden"
                        />
                        <input
                            id="submitNoBtn"
                            type="button"
                            value="NO"
                            onclick="submitNo()"
                            class="btn btn-primary"
                            style="visibility: hidden"
                        />
                    </div>
                </div>
            </form>
            <div class="form-group row" id="witnessListContainer" style="display: none">
                <label for="witness" class="col-sm-4 col-form-label">
                    Available Witnesses
                </label>
                 <div class="col-sm-8">
                    <ul class="list-inline" id="witnessList"></ul>
                </div>
            </div>
        </div>
    </body>
</html>
